<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>云课堂</title>
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./reset.css">
    <link rel="stylesheet" href="./xdclass.css">
    <script src="http://at.alicdn.com/t/font_2925131_dzhrwlgz4xf.js"></script>
</head>

<body>
<div class="xdclass_home">
    <div class="header_img">
        <img src="https://xdvideo-file.oss-cn-shenzhen.aliyuncs.com/video/2021/71-HLSJCL/hd.jpeg" alt="">
    </div>
    <div class="header_nav">
        <div class="nav_left">
            <img src="https://file.xdclass.net/xdclass/xdclass_logo.png" alt="">
            <div>首页</div>
            <div>课程中心</div>
            <div>超级会员
                <i>hot</i>
            </div>
            <div>学习路线<i>hot</i></div>
            <div>一对一辅导<i>hot</i></div>
            <div>工具</div>
            <div>回答论坛</div>
            <input type="text">
            <svg class="sousuo" aria-hidden="true">
                <use xlink:href="#icon-sousuo"></use>
            </svg>
        </div>
        <div class="nav_right">
            <div>课程骨折
                <i>hot</i>
            </div>
            <div>云服务器
                <i>hot</i>
            </div>
            <div>课程兑换码</div>
            <div>
                <svg class="vip" aria-hidden="true">
                    <use xlink:href="#icon-VIP"></use>
                </svg>
            </div>
            <div>我的学习</div>
            <div>
                <img src="https://gw.alicdn.com/tps/TB1W_X6OXXXXXcZXVXXXXXXXXXX-400-400.png" alt="" class="right_img">
            </div>
        </div>
        <div class="banner">
            <div class="banner_left">
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
            </div>
            <div class="banner_rigt">
                <img src="https://xdvideo-file.oss-cn-shenzhen.aliyuncs.com/video/2021/71-HLSJCL/LBT.jpeg" alt="">
            </div>
        </div>
    </div>

</html>